import React, {Component} from 'react';
import { PageHeader,Steps, Button } from 'antd';
import './index.less'
import CarDeatil from "./CarDetail";
import Confirm from "./Confirm";
const { Step } = Steps;
const steps = [
    {
        title: '购物车',
        content: <CarDeatil/>,
    },
    {
        title: '确认',
        content: <Confirm/>,
    }
];

class ShopCar extends Component {
    state = {
        current: 0
    }
    next = () => {
        this.setState({
            current: this.state.current + 1
        })
    }
    prev = () => {
        this.setState({
            current: this.state.current - 1
        })
    }
    render() {
        return (
            <div className='myShopCar'>
                <PageHeader
                    className="site-page-header ShopCarHead"
                    onBack={() => this.props.history.go(-1)}
                    title="购物车"
                    subTitle="买买买"
                />
                <div className="container">

                    {/*步骤条区域*/}
                    <Steps
                        className='step'
                        current={this.state.current}>
                        {steps.map(item => (
                            <Step key={item.title} title={item.title} />
                        ))}
                    </Steps>

                    <div className="steps-content">{steps[this.state.current].content}</div>
                    <div className="steps-action">
                        {this.state.current < steps.length - 1 && (
                            <Button type="primary" onClick={this.next}>
                                结算
                            </Button>
                        )}
                        {this.state.current > 0 && (
                            <Button style={{ margin: '0 16px' }} onClick={this.prev}>
                                上一步
                            </Button>
                        )}
                    </div>
                </div>
            </div>
        );
    }
}

export default ShopCar;